<template>
  <div class="top_div1">
    <div class="logo"></div>
    <div class="loginWrap">
      <div class="baseInput loginusername">
        <span class="userIcon"></span>
        <input type="text" placeholder="请输入用户名或邮箱" v-model="txt" />
      </div>
      <div class="baseInput loginpwd">
        <span class="passWord"></span>
        <input type="password" placeholder="请输入密码" v-model="password" />
      </div>
      <div class="Login">
        <a class="Login" href="javascript:void(0);" @click="login"></a>
      </div>
    </div>
  </div>
</template>
<script>
import { Toast } from "vant";
import { mapState, mapActions } from "vuex";
import http from "@/utils/http";
export default {
  data() {
    return {
      txt: "",
      password: ""
    };
  },
  computed: {
    ...mapState(["account"])
  },
  methods: {
    ...mapActions(["setAccount"]),
    login() {
      if (this.txt == "") {
        Toast("请输入用户名!");
      } else if (this.password == "") {
        Toast("请输入密码!");
      } else {
        http
          .post("/api/login/account/platform_admin_login", {
            account_name: this.txt,
            password: this.password
          })
          .then(response => {
            if (response.data.status == true) {
              let res = response.data;
              this.txt = "";
              this.password = "";
              window.sessionStorage.setItem("token", res.token);
              localStorage.setItem("account",JSON.stringify( res.data));
              localStorage.setItem("platforn_admin_lottery",JSON.stringify( response.data.data.platform_setting.lottery));
              console.log(response,"response-------------");
              console.log(response.data.data.platform_setting,">>>>")

              let redirect = this.$route.query.redirect || "/index";
              this.$router.replace(redirect);
            }
          });
      }
    }
  },
  created() {
    var that = this;
    document.onkeydown = function() {
      var key = window.event.keyCode
        ? window.event.keyCode
        : window.event.which;
      if (key == 13) {
        that.login();
      }
      // e.preventDefault()
    };
  }
};
</script>

<style scoped>
.top_div1 {
  padding-top: 130px;
  box-sizing: border-box;
  background: url(../../images/loginBg.jpg) no-repeat;
  background-size: 100% 100%;
  width: 100%;
  height: 100%;
}
.logo {
  background: url(../../images/zt.png) no-repeat center;
  background-size: 100% 100%;
  width: 100px;
  height: 130px;
  margin: 0 auto 70px;
}
.loginWrap {
  background: url(../../images/formBg_03.png) no-repeat center;
  background-size: 100% 100%;
  width: 414px;
  height: 373px;
  margin: 0 auto;
  padding-top: 30px;
  box-sizing: border-box;
}
.baseInput {
  background: url(~@/images/inputBg_03.png) no-repeat center;
  background-size: 100% 100%;
  width: 312px;
  height: 45px;
  margin: 28px auto 0;
  line-height: 42px;
}
.baseInput span {
  display: inline-block;
  height: 20px;
  width: 50px;
  border-right: 1px solid #ffffff;
  vertical-align: middle;
  background-size: 24px 20px;
}
.userIcon {
  background: url(.~@/images/userIcon.png) no-repeat center;
  background-size: 32px 32px;
}
.top_div1 .baseInput input {
  background-color: transparent;
  border: none;
  color: #ffffff;
  vertical-align: middle;
  height: 32px;
  width: 240px;
  outline: none;
  margin-bottom: 0px;
}
.passWord {
  background: url(.~@/images/passIcon.png) no-repeat center;
}
a.Login {
  width: 332px;
  height: 65px;
  display: block;
  margin: 26px auto 0;
  /* background: blue; */
  background: url(.~@/images/loginBtn_03.png) no-repeat center;
}
</style>
